<template>
	<el-container>
		<el-header class="elheader">
			<el-row :gutter="20">
				<el-col :span="6"><h3 style="line-height: 60px;color: white;">石泉书店后台管理系统</h3></el-col>
				<el-col :span="13"></el-col>
				<el-col :span="4"><el-avatar :size="50"></el-avatar><span style="position: absolute;width: 100px;bottom: 35%;">未登录</span>
				</el-col>
				<el-col :span="1">
					<span style="line-height: 60px;">退出</span>
				</el-col>
			</el-row>
		</el-header>
		<el-container>
			<el-aside width="400px" style="border: 1px solid black;">
				<el-menu
				  default-active="2"
				  class="el-menu-vertical-demo"
				  @open="handleOpen"
				  @close="handleClose"	
				  :router="true">
				  <el-menu-item-group>
				    <template >分组一</template>
				    <el-menu-item index="/admin/Type">类型92版</el-menu-item>
				    <el-menu-item index="/admin/Type2">类型93版</el-menu-item>
				    <el-menu-item index="/admin/TypeAdd">商品管理</el-menu-item>
				    <el-menu-item index="/admin/TypeEdit">热度图片</el-menu-item>
				  </el-menu-item-group>
				</el-menu>
			</el-aside>
			<el-main>
				<router-view></router-view>
			</el-main>
		</el-container>
	</el-container>
</template>

<script>
// 引入Type组件
//import Type from './page/Type';
// 
export default{
	name:'Admin',
	methods: {
	      handleOpen(key, keyPath) {
	        console.log(key, keyPath);
	      },
	      handleClose(key, keyPath) {
	        console.log(key, keyPath);
	      }
	    }
}
</script>

<style scoped>
*{
	margin: 0;
	padding: 0;
}
/*  */
.elheader{
	width: 100%;
	background-color: #3575ff;
}
.el-menu-demo{
	background-color: #3575ff;
}
</style>
